<template>
    <TaBar>
          <TabBarItem path='/home' activeColor='deeppink'>
              <template v-slot:item-icon >
                  <img src="@/assets/img/tabbar/home.svg" alt="">
              </template>
              <template v-slot:item-icon-active>
                  <img src="@/assets/img/tabbar/home_active.svg" alt="">
              </template>
              <template v-slot:item-text>
                  <div>首页</div>
              </template>
          </TabBarItem>
        <TabBarItem path='/category'
          activeColor='deeppink'>
              <template v-slot:item-icon>
                  <img src="@/assets/img/tabbar/category.svg" alt="">
              </template>
              <template v-slot:item-icon-active>
                  <img src="@/assets/img/tabbar/category_active.svg" alt="">
              </template>
              <template v-slot:item-text>
                  <div>分类</div>
              </template>
          </TabBarItem>
           <TabBarItem path='/cart'
           activeColor='deeppink'>
              <template v-slot:item-icon>
                  <img src="@/assets/img/tabbar/cart.svg" alt="">
              </template>
              <template v-slot:item-icon-active>
                  <img src="@/assets/img/tabbar/cart_active.svg" alt="">
              </template>
              <template v-slot:item-text>
                  <div>购物车</div>
              </template>
          </TabBarItem>
           <TabBarItem path='/profile'
           activeColor='deeppink'>
              <template v-slot:item-icon>
                  <img src="@/assets/img/tabbar/profile.svg" alt="">
              </template>
              <template v-slot:item-icon-active>
                  <img src="@/assets/img/tabbar/profile_active.svg" alt="">
              </template>
              <template v-slot:item-text>
                  <div>我的</div>
              </template>
          </TabBarItem>
    </TaBar>
</template>

<script>
import TaBar from '../common/tabbar/TabBar'
import TabBarItem from '../common/tabbar/TabBarItem'
export default {
  components: {
    TaBar,
    TabBarItem
  }
}
</script>

<style>

</style>
